<template>
	<gui-page ref="guiPage" :customHeader="true">
		<template v-slot:gHeader>
			<nav-bar-custom left-icon="left" :title="$t('translationImage.processInspection')"></nav-bar-custom>
		</template>
		<template v-slot:gBody>
			<view style="width: 750rpx;overflow-x: auto;">
				<view class="h-table pqc-table" style="background: #fff;width: 750rpx;">
					<view class="h-tr h-tr-6 h-thead ">
						<view class="h-td">{{ $t('translationImage.process') }}</view>
						<view class="h-td">{{ $t('translationImage.classes') }}</view>
						<view class="h-td">{{ $t('translationImage.means') }}</view>
						<view class="h-td">{{ $t('translationImage.inspectionResult') }}</view>
						<view class="h-td">{{ $t('translationImage.operation') }}</view>
						<view class="h-td">{{ $t('translationImage.operation') }}</view>
					</view>
					<view :style="'height: calc(100vh - ' + navHeight + 'px);overflow-y: auto;'">
						<view class="h-tr h-tr-6" v-for="(x, i) in data.testList" :key="i"
							:class="i % 2 != 0 ? 'space-tdeven' : 'space-tdodd'">
							<view class="h-td">
								<view class="spaceline"></view>
								<view class="space-td">{{ x.processNameShow }}</view>
							</view>
							<view class="h-td h-td-colspan h-td-rowspan">
								<block v-for="(k, index) in x.shifts" :key="index">
									<view class="h-tr h-tr-5">
										<!-- isYesterday(k.checkDate) ||  -->
										<view class="h-td"
											:class="(x.shifts.length > 1 && k.testCodes.length && index == 0) ? 'pqc-yesterday' : ''">
											{{ k.shiftCodeShow }}</view>
										<view class="h-td h-td-colspan h-td-rowspan">
											<view class="h-tr h-tr-4" v-for="(l, s) in k.testCodes" :key="s">
												<view class="h-td">{{ l.testTypeName }}</view>
												<view class="h-td" @click="look(x, k, l)">
													{{ $t('translationImage.examine') }}</view>
												<view class="h-td" :class="l.isStart ? 'pqc-begun' : ''">
													<view @click="beginTest(x, k, l)">
														{{ $t('translationImage.starCheckout') }}
													</view>
												</view>
												<view class="h-td" :class="l.isCheck ? 'pqc-begun' : ''">
													<view @click="inputTest(x, k, l)">
														{{ $t('translationImage.entryInspection') }}
													</view>
												</view>
											</view>
										</view>
									</view>
								</block>
							</view>
						</view>
					</view>
				</view>
				<!-- 产线查看弹窗 -->
				<uni-popup ref="showDialog" type="center">
					<view class="input-dialog-box">
						<view class="input-dialog-content">
							<view class="gui-text" style="margin-bottom: 20rpx;">
								{{ data.lookPopInfo.processName }}/{{ data.lookPopInfo.shiftCode }}/{{ data.lookPopInfo.testTypeName }}
							</view>
							<scroll-view :show-scrollbar="false" :scroll-y="true" class="scroll-view">
								<view class="itemview" v-for="(x, i) in data.lookList" :key="i">
									<view class="itemview-title">
										{{ $t('multilingual.productionLine') }}：{{ x.productionLineCode }}</view>
									<view class="itemview-sub"
										:class="(x.testTypeCode == 'FPH' ? x.noDestroyStatus : x.destroyStatus) == 'pass' ? 'pass' : (x.testTypeCode == 'FPH' ? x.noDestroyStatus : x.destroyStatus) == 'fail' ? 'fail' : ''">
										{{ $t('translationImage.inspectionResult') }}：{{ checkResText((x.testTypeCode =='FPH' ? x.noDestroyStatus : x.destroyStatus)) }}</view>
								</view>
							</scroll-view>
						</view>
						<view class="input-dialog-footer">
							<view class="input-dialog-button dialog-button-left" @click="close">
								{{ $t('translationImage.close') }}
							</view>
						</view>
					</view>
				</uni-popup>
				<!-- 产线选择弹窗 -->
				<uni-popup ref="choiceDialog" type="center">
					<view class="input-dialog-box">
						<view class="input-dialog-content">
							<view class="gui-text" style="margin-bottom: 20rpx;">
								{{ data.producCurrentPop.processName }}/{{ data.producCurrentPop.shiftCode }}/{{ data.producCurrentPop.testTypeName }}
							</view>
							<view class="uni-list">
								<radio-group @change="radioChange">
									<label class="gui-border-b" v-for="(item) in data.producLineList"
										:key="item.id">
										<view class="gui-flex gui-align-items-center">
											<radio style="transform:scale(0.7)" :value="item.id + ''"
												:checked="item.id == data.selectproducLine" />
											{{ item.productionLineCode }}
										</view>
									</label>
								</radio-group>
							</view>
						</view>
						<view class="input-dialog-footer">
							<view class="input-dialog-button" @click="cancelFn">
								{{ $t('popup.cancel') }}
							</view>
							<view class="input-dialog-button dialog-button-left" @click="choiceAffirm">
								{{ $t('popup.confirm')}}
							</view>
						</view>
					</view>
				</uni-popup>
			</view>
		</template>
	</gui-page>
</template>

<script setup>
// 引入 
import {onShow,} from '@dcloudio/uni-app';
import {reactive,computed,onMounted,ref} from 'vue';
import {flatten} from '@/utils/index.js'
import {selectPqcCheckByShift,selectPqcItemCheckResult,selectMeetLine,fillStartTime,selectMeetLineSecond} from '@/api/api.js'
import { basPdaOperationLogFn } from '@/utils/index.js';
import { OPERATION_START, OPERATION_BOOK, OPERATION_LOOK } from '@/constant/index.js'
import {navigate} from '@/utils/routerSkip.js'
import {useStore} from "vuex";

//JS国际化引入
import { useI18n } from 'vue-i18n';
const { t } = useI18n();

let store = useStore();
let showDialog = ref(null)
let choiceDialog = ref(null)
// 页面底部高度
const navHeight = computed(() => {
	return Number(store.state.navHeight) + 36
})
// 文字显示
const checkResText = computed(() => (status) => {
	let textList = [{
		value: 'waitCheck',
		text: t('translationImage.checkedNo')
	},
	{
		value: 'pass',
		text: t('translationImage.qualified')
	},
	{
		value: 'fail',
		text: t('translationImage.qualifiedNo')
	},
	]
	let text = textList.filter(x => x.value == status)[0].text;
	return text
})
const getTimeFn = (date) => {
	let y = date.getFullYear() //年
	let m = date.getMonth() + 1  //月，月是从0开始的所以+1
	let d = date.getDate() //日
	m = m < 10 ? "0" + m : m //小于10补0
	d = d < 10 ? "0" + d : d //小于10补0
	return y + "-" + m + "-" + d; //返回时间形式yyyy-mm-dd
}
// 前一天当班显示
const isYesterday = computed(() => (data) => {
	let time = getTimeFn(new Date())
	let incoming = new Date(data).getTime()
	let now = new Date(time).getTime();

	if (incoming < now) {
		return true
	} else {
		return false
	}
})
let data = reactive({
	testList: [], //页面表格检测数据
	lookList: [], //查看弹窗数据
	producLineList: [], //产线数据
	selectproducLine: '', //用户选择产线
	producCurrentPop: {}, //当前选择弹窗的信息
	lookPopInfo: {} //当前查看弹窗的信息
})
onShow(() => {
	selectPqcCheckByShiftFn()
})

const radioChange = (etv) => {
	console.log(etv.detail.value);
	data.selectproducLine = etv.detail.value
}
// 录入检测
const inputTest = (x, k, l) => {
	console.log(x.processName, '工序名字')
	console.log(x.processCode, '工序code')
	console.log(k.shiftCode, '班次code')
	console.log(k.checkDate, '检测日期')
	console.log(l.testTypeCode, '检测类型')
	console.log(k.pqcCount, '第几次')
	let param = {
		processCode: x.processCode,
		shiftCode: k.shiftCode,
		pqcCount: k.pqcCount,
		checkDate: k.checkDate,
		checkLocalDate: k.checkDate,
		testTypeCode: l.testTypeCode,
		selectType: 'detail'
	}
	selectMeetLineSecond(param).then(res => {
		console.log(res);
		try {
			let inputParameter = JSON.stringify(param)
			let returnParameter = JSON.stringify(res)
			let operationPicture = '过程检验'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.msg,//错误信息
				isPass: res.code == 0 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_BOOK,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		if (res.code ==0 && res.data.length > 0) {
			navigate({
				url: `/pages/qms/pqcInput?processCode=${x.processCode}&shiftCode=${k.shiftCode}&checkDate=${k.checkDate}&testTypeCode=${l.testTypeCode}&pqcCount=${k.pqcCount}&processName=${x.processName}`
			})
		} else if (res.code == 0 && res.data.length == 0) {
			uni.showToast({
				title: t('JsInternational.chooseToStart'),
				icon: "none"
			});
		} else {
			uni.showToast({
				title: res.msg,
				icon: "none"
			});
		}
	})
}
// 开始 检测
const beginTest = (x, k, l) => {
	console.log(x.processCode, '工序code')
	console.log(k.shiftCode, '班次code')
	console.log(k.checkDate, '检测日期')
	console.log(l.testTypeCode, '检测类型')
	console.log(k.pqcCount, '第几次')
	data.producCurrentPop = {
		processCode: x.processCode,
		shiftCode: k.shiftCode,
		checkDate: k.checkDate,
		checkLocalDate: k.checkDate,
		testTypeCode: l.testTypeCode,
		pqcCount: k.pqcCount,
		processName: x.processName,
		shiftCode: k.shiftCode,
		testTypeName: l.testTypeName
	}
	let param = {
		processCode: x.processCode,
		shiftCode: k.shiftCode,
		pqcCount: k.pqcCount,
		checkDate: k.checkDate,
		checkLocalDate: k.checkDate,
		testTypeCode: l.testTypeCode,
		selectType: 'startTime'
	}
	selectMeetLine(param).then(res => {
		try {
			let inputParameter = JSON.stringify(param)
			let returnParameter = JSON.stringify(res)
			let operationPicture = '过程检验'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.msg,//错误信息
				isPass: res.code == 0 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_START,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		console.log(res)
		choiceDialog.value.open()
		if (res.code == 0) {
			data.producLineList = res.data;
		} else {
			uni.showToast({
				title: res.message,
				icon: "none"
			});
		}
	})

}
// 获取今天所有的检测数据
const selectPqcCheckByShiftFn = () => {
	selectPqcCheckByShift({}).then(res => {
		try {
			let inputParameter = JSON.stringify({})
			let returnParameter = JSON.stringify(res)
			let operationPicture = '过程检验'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.msg,//错误信息
				isPass: res.code == 0 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_LOOK,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		if (res.code == 0) {
			// 重构json数据
			let list = res.data.map(x => {
				return x.pqcCountInfo.map((k, i) => {
					return {
						processCode: x.processCode,
						processNameShow: x.processName + (i == 0 ? '' : i),
						// processNameShow: x.processCode == 'JKJ' ? x.processName + (i + 1) : x.processName + (i == 0 ? '' : i),
						processName: x.processName,
						index: i,
						shifts: k.shifts
					}
				})
			})
			data.testList = flatten(list);
			data.testList.forEach(element => {
				let arr = element.shifts.filter((x) => {
					return x.testCodes.length
				})
				element.shifts = arr
				element.shifts.forEach(x => {
					if (x.shiftCode == 'MorningShift') {
						x.shiftCodeShow = 'Day'
					} else {
						x.shiftCodeShow = 'Night'
					}
					// x.shiftCodeShow = x.shiftCode.replace('Shift','')
					x.testCodes.forEach(i => {
						i.testTypeName = i.testTypeName.replace('_zh_CN', '')
					});
				});
			});

		} else {
			uni.showToast({
				title: res.msg,
				icon: "none"
			});
		}
	})
}
// 用户点击 查看
const look = (x, k, l) => {
	console.log(x.processCode, '工序code')
	console.log(k.shiftCode, '班次code')
	console.log(k.checkDate, '检测日期')
	console.log(l.testTypeCode, '检测类型')
	console.log(k.pqcCount, '第几次')
	let param = {
		processCode: x.processCode,
		shiftCode: k.shiftCode,
		pqcCount: k.pqcCount,
		checkDate: k.checkDate,
		checkLocalDate: k.checkDate,
		testTypeCode: l.testTypeCode
	}
	data.lookPopInfo = {
		processName: x.processName,
		shiftCode: k.shiftCode,
		testTypeName: l.testTypeName,
		testTypeCode: l.testTypeCode
	};
	selectPqcItemCheckResult(param).then(res => {
		try {
			let inputParameter = JSON.stringify(param)
			let returnParameter = JSON.stringify(res)
			let operationPicture = '过程检验'
			let callInterface = res.rquestUrl
			let opertionParmes = {
				inputParameter,
				returnParameter,
				operationPicture,
				callInterface,
				responseCode: res.code,//返回状态
				errorMessage: res.msg,//错误信息
				isPass: res.code == 0 ? 'Y' : 'N',//是否成功 Y N
				operationType: OPERATION_LOOK,
				module: 'WMS',
				source: "PDA",
			}
			basPdaOperationLogFn(opertionParmes)
		} catch (error) {
		}
		console.log(res, 'hhhhhh')
		if (res.code == 0) {
			data.lookList = res.data
			showDialog.value.open()
		} else {
			uni.showToast({
				title: res.msg,
				icon: "none"
			});
		}
	})
}
// 选择产线弹窗取消
const cancelFn = () => {
	choiceDialog.value.close()
}
// 选择产线弹窗确认
const choiceAffirm = () => {
	if(!data.producLineList.length||data.selectproducLine==''){
		uni.showToast({
				title: t('materials.noData'),
				icon: "none"
			});
		return
	}
	uni.showModal({
		content: t('JsInternational.submitConfirm'),
		success: (res) => {
			if (res.confirm) {
				submitProductionLine()
			} else if (res.cancel) {
				console.log('用户点击取消');
			}
		}
	});
}
const submitProductionLine = () => {
	console.log(data.producCurrentPop)
	fillStartTime({
		id: data.selectproducLine,
		testTypeCode: data.producCurrentPop.testTypeCode
	}).then(res => {
		if (res.code == 0) {
			selectPqcCheckByShiftFn()
			uni.showToast({
				title: t('JsInternational.inspectionTime'),
				icon: "none"
			});
			choiceDialog.value.close()
		} else {
			uni.showToast({
				title: res.msg,
				icon: "none"
			});
		}
	})
}
// 关闭弹窗
const close = () => {
	showDialog.value.close()
}
</script>

<style lang="scss" scoped>
.space-tdodd {
	background: #e6e6e6;
	position: relative;
}

.space-tdeven {
	background: #fff;
	position: relative;
}

.spaceline {
	position: absolute;
	top: 0px;
	right: 100%;

}

.test-result-item {
	line-height: 36rpx;
}

.scroll-view {
	width: 100%;
	height: 500rpx;
}

.itemview {
	padding: 12rpx 15rpx;

	.itemview-title {
		font-size: 14px;
		color: #3b4144;
	}

	.itemview-sub {
		font-size: 12px;
		color: #999;
	}

	.pass {
		color: rgb(55, 136, 108);
	}

	.fail {
		color: red;
	}
}

.pqc-table {
	font-size: 26rpx;
}

.choiceDialog-title {
	text-align: center;
	line-height: 58rpx;
}

.pqc-list {
	::v-deep .uni-list-item__container {
		padding: 8rpx 30rpx;
	}
}

.pqc-yesterday {
	background-color: red;
	color: #fff;
}

.pqc-begun {
	background-color: #55ff00;
	color: #fff;
}

.pqc-begreen {
	background-color: rgb(55, 136, 108);
	color: #fff;
}
</style>
